<script setup lang="ts">
import type Typings from "@/typings";
import { ref } from "vue";
import useHookRouter from "@/hooks/router";
import useMenuStore from "@/pinia/menu";
import useSettingStore from "@/pinia/setting";
const menuStore = useMenuStore();
const settingStore = useSettingStore();

interface MenuProp {
  menuList: Partial<Typings.Menu.props>[];
  currentPath: string;
}

// 当前路由路径设置为默认菜单
const { currentPath } = useHookRouter();

// menu 相关数据
const menu = ref<MenuProp>({
  menuList: menuStore.menuList,
  currentPath: currentPath.value,
});
</script>

<template>
  <div class="layout-aside-container w-full h-full overflow-hidden bg-white">
    <el-scrollbar height="100%" view-class="h-full">
      <!-- <div class="log w-full h-[40px] bg-[#e7e7e7]"></div> -->

      <xt-menu
        class="menu-container"
        router
        unique-opened
        :menuList="menu.menuList"
        :collapse="settingStore.collapse"
        :default-active="menu.currentPath"
      />
    </el-scrollbar>
  </div>
</template>

<style lang="scss" scoped>
.layout-aside-container {
  border-right: 1px solid #e7e7e7;
  .menu-container {
    border: none;
    &:not(.el-menu--collapse) {
      width: 200px;
    }
  }
}
</style>
